<template>
	<view>
		<uni-card v-for="i in photos.data">
			<image style="width: 100%;" :src=i.img[0] @click="detail(i.id)"></image>
			<text class="uni-body">{{i.content}}</text>
			<view>
				<text class="uni-body">{{i.time}}</text>
			</view>
			<view slot="actions" class="card-actions">
				<view class="card-actions-item" @click="like(i)" style="float: right;" v-if="i.isLiked">
					<uni-icons  type='heart-filled' size="18" color="#999"></uni-icons>
					<text class="card-actions-item-text" @click="like">点赞</text>
				</view>
				<view class="card-actions-item" @click="like(i)" style="float: right;" v-else>
					<uni-icons  type='heart' size="18" color="#999"></uni-icons>
					<text class="card-actions-item-text" @click="like">点赞</text>
				</view>
				<view class="card-actions-item" @click="detail(i.id)" style="float: left;">
					<uni-icons type="chatbubble" size="18" color="#999"></uni-icons>
					<text class="card-actions-item-text">评论</text>
				</view>
			</view>
		</uni-card>
		<view @click="getmore" style="text-align: center;">---下拉加载更多---</view>
		<view>
			<u-toast ref="uToast"/>
		</view>
	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				//相册分页信息
				photos: {
					currPage: 1,
					currPageSize: 0,
					pageSize: 0,
					totalNums: 0,
					totalPages: 0,
					//相册详情
					data: []
				},
				extraIcon: {
					color: '#4cd964',
					size: '22',
					type: 'gear-filled'
				}
			}
		},
		//加载页面执行
		onLoad() {
			this.getdata()
		},
		// 下拉加载更多数据
		onReachBottom() {
			this.getmore();
		},
		methods: {
			//获取相册列表
			getdata() {
				this.$myReq({
					url: '/photo/api/allphoto/1/' + this.photos.currPage + '/4',
					method: 'get'
				}).then(r => {
					this.photos = r.data
					console.log(this.photos);
				})
			},
			//下拉加载更多
			getmore() {
				this.photos.currPage++
				this.$myReq({
					url: '/photo/api/allphoto/1/' + this.photos.currPage + '/4',
					method: 'get'
				}).then(r => {
					if (!(r.data.data.length == 0 || r.data.data.length == null)) {
						for (let i of r.data.data) {
							this.photos.data.push(i)
						}
					} else {
						this.showToast("没有更多内容")
					}

				})
			},
			//没有更多提示
			showToast(text) {
				uni.showToast({
					title: text,
					icon: "none"
				});
			},
			//点赞
			like(i) {
				this.$myReq({
					url: '/photo/api/like/'+i.id,
					method: 'post'
				}).then(r=>{
					if(i.isLiked==false){
						i.isLiked=true
					}else{
						i.isLiked=false
					}
					this.showToast("操作成功")
				})
			},
			//详情/评论
			detail(photoId) {
				uni.navigateTo({
					url: '/pages/photo/photodetail?photoId='+photoId
				})
			}
		}
	}
</script>
<style>
</style>
